<template>
    <div>
        <input type="text" v-model="text" @keydown.enter="addItem"/> 
    </div>
</template>

<script>
//抖树..
import {ref,toRefs} from 'vue'
export default {
    //选项式里面 setup函数.
    emits:['add-item'],
    setup (props,context) {
        // props 如果解构 会失去响应式. 可以用toRefs(props)包装后在解构.
        let {tododata}=toRefs(props);//把props里面的每个属性做转化为响应式数据.
        //setup函数的参数 props props属性 context当前组件的上下文 context.emit context.slot context.attrs
        let text=ref("");
        let addItem=()=>{
            //这里没有this
            // this.$emit('add-item',text.value)
            context.emit('add-item',text.value);
            text.value=""
        }
        return {
            text,
            addItem
        }
    }
}
</script>

<style lang="scss" scoped>

</style>